<!DOCTYPE html>
<html lang="en">

<!--
  Author：蓝田_Loto
  Date：2018-08-30 9:17
  PageName：c_practice_index.html
  Function：第一个CSS3+DIV页面
  URL：http://localhost:8080/c_character/c_practice_index.html
-->

<head>
    <meta charset="UTF-8">
    <title>第一个CSS3+DIV页面</title>
    <link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>
<!-- 顶部 -->
<div id="top"></div>
<div id="top1">
    <img src="image/bg_top.jpg" width="776" height="121" alt="顶部图片"/>
</div>

<!-- 主体 -->
<div id="main">
    <div id="content">
        <div id="title"> 第一个CSS3+DIV页面</div>
        <div class="sub">实例</div>

        <div class="box">
            <div class="tl">
                <div class="tr">
                    <div class="bl">
                        <div class="content br"> 以下代码是我的第一个CSS3+DIV页面，该页面红色居中显示字符串 Hello World!。
                            <pre>
&lt;!doctype html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta charset=&quot;utf-8&quot;&gt;
        &lt;title&gt;Hello World&lt;/title&gt;
        &lt;style type=&quot;text/css&quot;&gt;
        h1 {
            color: #FF0000;
            text-align: center;
        }
        &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;h1&gt;Hello World! &lt;/h1&gt;
    &lt;/body&gt;
&lt;/html&gt;
                            </pre>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div id="gotop">
            <a title="跳到页首" href="#top">返回顶部</a>
        </div>

    </div>
</div>

<!-- 底部 -->
<div id="footer"></div>
<div id="copyright">
    &copy;2018 <a href="#" target="_black">mysite.cn</a> all rights reserved
</div>
</body>
</html>